<template>
    <view class="index">
        <view class="lunbo vh-c">
            <u-swiper class="lunbo" :list="detail.images?detail.images.split(','):list1" @change="change" @click="click" imgMode='scaleToFill'> </u-swiper>
        </view>
        <view class="shoujiaBox vh-cb">
            <view class="vh-c">
                <image class="label" src="../../static/imgs/sj.png" mode="aspectFit"></image>
                <text class="moneyicon">￥</text>
                <text class="moneynum">{{detail.price?detail.price:0}}</text>
            </view>
            <!-- <view class="yishou">
                <text>已售</text>
                <text>1234件</text>
            </view> -->
        </view>
        <view class="content">
            <view class="vh-sb">
                <view class="title">{{detail.name}}</view>
                <p class="guige" v-if="detail.format">{{detail.format?detail.format:''}}</p>
            </view>
            <view class="jieshao">
                {{detail.content?detail.content:''}}
            </view>

        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            list1: [
                require('../../static/imgs/nodata.png')
                ],
            detail:{}
        };
    },
    //第一次加载
    // onLoad(e) {
    //     console.log('asd')
    //     uni.showLoading({
    //         title: '加载中',
    //         mask: true
    //     });
    //     // 隐藏原生的tabbar
    //     // uni.hideTabBar();
    // },
    //页面显示
    onShow() {
        // 隐藏原生的tabbar
        uni.hideTabBar();
    },

    onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
        console.log(option.id); //打印出上个页面传递的参数。
        this.id=option.id
        this.gotodetail()
    },
    //方法
    methods: {
        gotodetail() { 
            this.$http.get('/promotion/goodsInfo/'+this.id).then(val => {
                this.detail=val.data
            })
        }
    },
    onReady() {
        // uni.hideLoading();
    },
    //方法
    //页面隐藏
    onHide() { },
    //页面卸载
    onUnload() { },
    //页面下来刷新
    onPullDownRefresh() { },
    //页面上拉触底
    onReachBottom() { },
    //用户点击分享
    onShareAppMessage(e) {
        return this.wxShare();
    }
};
</script>
<style lang="scss">
.index {
    min-height: 100vh;
    background-color: #fff;
    .lunbo {
        .u-swiper {
            // border-radius: 20rpx !important;
            width: 100% !important;
            height: 100vw !important;
        }
        .u-swiper__wrapper__item__wrapper__image,
        swiper {
            height: 100% !important;
        }
        image{
            width: 100vw;
            height: 100vw;
        }
    }
    .shoujiaBox {
        background: url("../../static/imgs/shoujia.png") #d4e2ff no-repeat;
        height: 100rpx;
        background-size: 73%;
        .label {
            width: 88rpx;
            height: 68rpx;
            margin: 0 50rpx 0 25rpx;
        }

        .moneyicon {
            color: #fff;
            font-size: 26rpx;
        }
        .moneynum {
            font-size: 46rpx;
            font-weight: bold;
            color: #fff;
            line-height: 1.6;
        }
        .yishou {
            font-size: 22rpx;
            font-weight: 400;
            color: #005beb;
            line-height: 30rpx;
            padding-right: 50rpx;
            text:nth-child(1) {
                padding-right: 20rpx;
            }
        }
    }
    .content {
        padding: 30rpx;
        .title {
            font-size: 32rpx;
            color: #333333;
            line-height: 38rpx;
        }
        .guige {
            font-size: 24rpx;
            margin-left: 20rpx;
            background: #f1f6ff;
            border-radius: 8rpx;
            border: 1rpx solid $themeColor;
            padding: 5rpx 15rpx;
            color: $themeColor;
            white-space:nowrap;
        }
        .jieshao {
            margin-top: 20rpx;
            padding-top: 20rpx;
            font-size: 26rpx;
            font-weight: 400;
            color: #666666;
            line-height: 37rpx;
            border-top: 2rpx solid #eaeaea;
        }
    }
}
</style>
